<template>
  <el-dialog title="设置角色" :show-close="false" :visible.sync="dialogTableVisible" top="2vh">
        <label>用户名：</label>
        <el-input v-model="userInfo.userLoginName" style="width:200px; margin-left:20px" disabled/>
      <br>
      <p>已选角色： <el-tag v-for="(item,index) in roleNames" :key='index'>{{item}}</el-tag></p>
     
    <RoleTable @handleSelections='handleSelections' :selectRoleId='selectRoleId'/>
    <span slot="footer" class="dialog-footer">
      <el-button @click="cancle()">取 消</el-button>
      <el-button type="primary" @click="addForm()">确 定</el-button>
    </span>
  </el-dialog>
</template>
<script>
import RoleTable from '../role/RoleTable'
import { Message } from "element-ui";
export default {
  components: {
    RoleTable
  },
  props:['userInfo'],
  data() {
    return {
      gridData: [
        
      ],
       dialogTableVisible: true,
       selections:[],
       user:{},
       selectRoleId:[],
       roleNames:[]
    };
  },
  methods: {
    cancle() {
      this.$emit("hideModel", false);
    },
    handleSelections(val){
      this.selections=val;
    },
    addForm(){
      let selTable=[]
      // console.log(this.selections)
      for (let i = 0; i <this.selections.length; i++) {
        selTable.push(this.selections[i].roleId)
      }
      const param=new URLSearchParams();
      param.append('userLoginName',this.user.userLoginName);
      param.append('userId',this.user.userId);
      // console.log("user-------------------------")
      // console.log(this.user)
      param.append('roleIds',selTable);
      const vm=this;
      vm.$http.post('/userRole/insertUserRole',param).then(res=>{
        if(res.data>0){
           Message({ message: "设置成功", type: "success" });
        }else{
           Message({ message: "设置失败", type: "error" });
        }
        this.$emit("hideModel", false);
      })
    }
  },
  mounted(){
    this.user=this.userInfo
    const vm=this;
    vm.$http.get('/userRole/selectAllRoleId',{params:{userId:this.user.userId}}).then(res=>{
      for (let i = 0; i < res.data.length; i++) {
        this.selectRoleId.push(res.data[i].roleId)
        console.log(vm.selectRoleId)
      }
    });
    vm.$http.get('/userRole/selectRoleNameByUId',{params:{userId:this.user.userId}}).then(res=>{
      // console.log(res.data)
      vm.roleNames=res.data
    })
  }
};
</script>
<style lang='less' scoped>
</style>